<!--巡检点上报异常-->
<template>
  <page-meta
    :page-font-size="baseFontSize + 'rpx'"
    :root-font-size="baseFontSize + 'rpx'"
  ></page-meta>
  <view class="u-page flex flex-direction">
    <view class="addr flex align-center">
      <view>当前位置</view>
      <view class="location flex-sub text-right"
        >{{ longitude }},{{ latitude }}</view
      >
      <view class="refresh">刷新</view>
    </view>
    <scroll-view scroll-y class="form flex-sub main">
      <view class="section">
        <image src="/static/images/base.png"></image>
        <text>基础信息</text>
      </view>
      <uni-forms :modelValue="formData" border label-width="16rem">
        <!-- <uni-forms-item label="设施名称" name="name">
					<view class="facility-name">{{ patrolParams.facilityName }}</view>
				</uni-forms-item> -->
        <uni-forms-item label="设施名称" name="name" :required="true">
          <song-data-picker
            openSearch
            placeholder="请选择设施名称"
            popup-title="请选择设施名称"
            :placeholderStyle="placeholderStyle"
            :localdata="dataTree1"
            v-model="patrolParams.facilityName"
            :border="false"
            @change="onchange1"
          ></song-data-picker>
        </uni-forms-item>
        <uni-forms-item label="上报状态" name="state">
          <song-data-picker
            placeholder="请选择上报状态"
            popup-title="请选择上报状态"
            :placeholderStyle="placeholderStyle"
            :localdata="stateData"
            v-model="formData.state"
            :border="false"
            :clear-icon="false"
            @change="changeState"
          ></song-data-picker>
        </uni-forms-item>
        <uni-forms-item label="巡查点" name="name">
          <map
            id="myMap"
            :scale="18"
            :latitude="latitude"
            :longitude="longitude"
            :markers="markers"
            :circles="circles"
            show-location
          ></map>
        </uni-forms-item>
        <uni-forms-item label="详细地址" name="name">{{
          location
        }}</uni-forms-item>
        <uni-forms-item label="巡查点名" name="name" :required="true">
          <song-data-picker
            openSearch
            placeholder="请选择巡查点名"
            popup-title="请选择巡查点名"
            :placeholderStyle="placeholderStyle"
            :localdata="xcdTree1"
            v-model="patrolParams.inspName"
            :border="false"
            @change="onchangeXcd"
          ></song-data-picker>
        </uni-forms-item>

        <template v-if="formData.state == '1'">
          <view class="section">
            <image src="/static/images/base.png"></image>
            <text>生成案卷</text>
          </view>
          <uni-forms-item label="病害部位" name="name" :required="true">
            <song-data-picker
              openSearch
              placeholder="请选择病害部位"
              popup-title="请选择病害部位"
              :placeholderStyle="placeholderStyle"
              :localdata="dataTree2"
              v-model="diseaseLocation"
              :border="false"
              @change="onchange2"
            ></song-data-picker>
          </uni-forms-item>
          <uni-forms-item label="病害构件" name="name" :required="true">
            <!-- <song-data-picker
							placeholder="请选择病害构件"
							popup-title="请选择病害构件"
							:placeholderStyle="placeholderStyle"
							:localdata="dataTree"
							v-model="classes"
							:border="false"
							@change="onchange"
							@nodeclick="onnodeclick"
							@popupopened="onpopupopened"
							@popupclosed="onpopupclosed"
						></song-data-picker> -->
            <song-data-picker
              openSearch
              placeholder="请选择病害构件"
              popup-title="请选择病害构件"
              :placeholderStyle="placeholderStyle"
              :localdata="dataTree3"
              v-model="brokenCommpont"
              @change="onchange3"
              :border="false"
            ></song-data-picker>
          </uni-forms-item>

          <uni-forms-item label="病害类型" name="name" :required="true">
            <song-data-picker
              openSearch
              placeholder="请选择病害类型"
              popup-title="请选择病害类型"
              :placeholderStyle="placeholderStyle"
              :localdata="typeList"
              v-model="brokenType"
              :border="false"
              @change="onchange"
            ></song-data-picker>
            <!-- <song-data-picker
							placeholder="请选择病害类型"
							popup-title="请选择病害类型"
							:placeholderStyle="placeholderStyle"
							:localdata="dataTree"
							v-model="classes"
							:border="false"
							@change="onchange"
							@nodeclick="onnodeclick"
							@popupopened="onpopupopened"
							@popupclosed="onpopupclosed"
						></song-data-picker> -->
          </uni-forms-item>
          <uni-forms-item label="病害等级" name="name" :required="true">
            <song-data-picker
              placeholder="请选择病害等级"
              popup-title="请选择病害等级"
              :placeholderStyle="placeholderStyle"
              :localdata="levelList"
              v-model="brokenLevel"
              :border="false"
              @change="onchange"
            ></song-data-picker>
            <!-- <song-data-picker
							placeholder="请选择病害等级"
							popup-title="请选择病害等级"
							:placeholderStyle="placeholderStyle"
							:localdata="dataTree"
							v-model="classes"
							:border="false"
							@change="onchange"
							@nodeclick="onnodeclick"
							@popupopened="onpopupopened"
							@popupclosed="onpopupclosed"
						></song-data-picker> -->
          </uni-forms-item>
          <uni-forms-item label="病害描述">
            <uni-easyinput
              type="textarea"
              :placeholderStyle="placeholderStyle"
              :inputBorder="false"
              v-model="formData.dealRemark"
              placeholder="请输入病害描述"
            />
          </uni-forms-item>
          <uni-forms-item label="病害损害面积(m2)">
            <uni-easyinput
              type="number"
              :step="0.01"
              :precision="2"
              :min="0"
              :placeholderStyle="placeholderStyle"
              :inputBorder="false"
              v-model="formData.area"
              placeholder="请输入病害损害面积(m2)"
            />
          </uni-forms-item>
          <uni-forms-item label="上传照片" name="name" :required="true">
            <!-- <upload></upload> -->
            <view class="preview-list">
              <view
                class="preview-item"
                v-for="(item, index) in fileList"
                :key="index"
              >
                <image
                  style="width: 120upx; height: 120upx"
                  :src="item"
                  @click="previewImage(fileList, index)"
                ></image>
                <uni-icons
                  class="delete-icon"
                  @click="removeImg(index)"
                  type="closeempty"
                  size="10"
                ></uni-icons>
              </view>
              <view class="upload-btn-area"
                ><image
                  v-if="fileList.length < 9"
                  @click="chooseImage"
                  src="/static/images/upload.png"
                  mode="widthFix"
                ></image
              ></view>
            </view>
          </uni-forms-item>
          <uni-forms-item label="处置建议" name="name" :required="true">
            <song-data-picker
              placeholder="请选择处置建议"
              popup-title="请选择处置建议"
              :placeholderStyle="placeholderStyle"
              :localdata="dealList"
              v-model="dealMsg"
              :border="false"
              @change="onchange"
            ></song-data-picker>
            <!-- <song-data-picker
							placeholder="请选择处置建议"
							popup-title="请选择处置建议"
							:placeholderStyle="placeholderStyle"
							:localdata="dataTree"
							v-model="classes"
							:border="false"
							@change="onchange"
							@nodeclick="onnodeclick"
							@popupopened="onpopupopened"
							@popupclosed="onpopupclosed"
						></song-data-picker> -->
          </uni-forms-item>
          <uni-forms-item label="道路开挖或列单项工程" v-if="tenantId == 144">
            <switch
              :checked="formData.isAdminAuth"
              @change="switchAuthChange"
            />
          </uni-forms-item>
          <uni-forms-item label="处置备注">
            <uni-easyinput
              type="textarea"
              :placeholderStyle="placeholderStyle"
              :inputBorder="false"
              v-model="formData.checkMark"
              placeholder="请输入处置备注"
            />
          </uni-forms-item>
        </template>
        <template v-else>
          <uni-forms-item label="上传照片" name="name">
            <!-- <upload></upload> -->
            <view class="preview-list">
              <view
                class="preview-item"
                v-for="(item, index) in fileList"
                :key="index"
              >
                <image
                  style="width: 120upx; height: 120upx"
                  :src="item"
                  @click="previewImage(fileList, index)"
                ></image>
                <uni-icons
                  class="delete-icon"
                  @click="removeImg(index)"
                  type="closeempty"
                  size="10"
                ></uni-icons>
              </view>
              <view class="upload-btn-area"
                ><image
                  v-if="fileList.length < 9"
                  @click="chooseImage"
                  src="/static/images/upload.png"
                  mode="widthFix"
                ></image
              ></view>
            </view>
          </uni-forms-item>
          <uni-forms-item label="上报内容">
            <uni-easyinput
              type="textarea"
              :placeholderStyle="placeholderStyle"
              :inputBorder="false"
              v-model="formData.reportContent"
              placeholder="请输入上报内容"
            />
          </uni-forms-item>
        </template>
      </uni-forms>
    </scroll-view>
    <view class="page-footer">
      <button
        @click="submitBtn"
        class="save-btn cu-btn block bg-blue lg"
        :disabled="isSubmiting"
        type="blue"
      >
        <uni-icons
          type="spinner-cycle"
          size="20"
          v-if="isSubmiting"
        ></uni-icons>
        提交
      </button>
    </view>
  </view>
</template>

<script>
import upload from "@/components/upload.vue";
import {
  getFacilityManagePage,
  getKgPlaceTypePage,
  getFacilityComponentPage,
  batchCreate,
  patrolPointPage,
} from "@/api/system/caseManage.js";
import { getDiseaseTypeListApi, getDiseaseListApi } from "@/api/common.js";
import { getUserProfile } from "@/api/system/user.js";
import QQMapWX from "../../utils/qqmap-wx-jssdk.min";
import {
  patrolTaskMobileReportPointApi,
  endPatrolApi,
} from "@/api/system/changxiao.js";
export default {
  components: { upload },
  data() {
    return {
      formData: {
        state: "0",
        checkMark: "",
        dealRemark: "",
        isAdminAuth: false,
      },
      stateData: [
        {
          text: "正常",
          value: "0",
        },
        {
          text: "异常",
          value: "1",
        },
      ],
      placeholderStyle: {
        fontSize: "14px",
      },
      latitude: 30.31974,
      longitude: 120.1421,
      circles: [
        {
          latitude: 30.31974,
          longitude: 120.1421,
          radius: 100,
          fillColor: "#AACCEE32",
          color: "#AACCEE",
          strokeWidth: 2,
        },
      ],
      patrolList: [],
      location: "",
      city: "",
      province: "",
      zone: "",
      reportContent: "",
      dataTree1: [],
      dataTree2: [],
      dataTree3: [],
      xcdTree1: [],
      device: null,
      diseaseLocation: null,
      brokenCommpont: null,
      typeList: [],
      brokenType: null,
      levelList: [],
      brokenLevel: null,
      dealList: [],
      dealMsg: "1",
      fileList: [],
      userObj: {},
      patrolParams: {},
      isSubmiting: false,
      chooseFacility: {},
      tenantId: null,
    };
  },
  computed: {
    baseFontSize() {
      return this.$store.getters.fontSize;
    },
  },
  onLoad(e) {
    console.log(
      "%c [ e ]-343",
      "font-size:13px; background:pink; color:#bf2c9f;",
      e
    );
    this.tenantId = uni.getStorageSync("TenantId");
    this.patrolParams = { ...e };
    console.log(this.patrolParams, "this.patrolParams");
    // 获取位置
    this.startLocationUpdate();
    this.getDataTree1();
    this.getDataXcd();
    // this.getDiseaseTypeList()
    this.getDiseaseLevelList();
    this.getDiseaseDealList();
    this.getUser();
  },
  methods: {
    switchAuthChange(e) {
      this.formData.isAdminAuth = e.detail.value;
    },
    previewImage(photoImg, index) {
      uni.previewImage({
        current: index,
        urls: photoImg,
      });
    },
    onchange(e) {
      console.log(e);
    },
    getUser() {
      getUserProfile().then((res) => {
        this.userObj = res.data;
      });
    },
    chooseImage() {
      uni.chooseImage({
        count: 9,
        sizeType: ["compressed"],
        sourceType: ["album", "camera"],
        success: (res) => {
          const tempFilePaths = res.tempFilePaths;
          this.uploadImage(tempFilePaths);
        },
      });
    },
    uploadImage(images) {
      const count = images.length;
      let currentIndex = 0;
      for (let i = 0; i < count; i++) {
        uni.uploadFile({
          url: "https://ruoyi.51wephone.cn/admin-api/infra/file/upload", //上传接口地址
          filePath: images[i],
          name: "file",
          formData: {},
          header: {
            Authorization: `Bearer ${uni.getStorageSync("ACCESS_TOKEN")}`,
          },
          success: (res) => {
            currentIndex++;
            const data = JSON.parse(res.data);
            if (currentIndex >= count) {
              uni.showToast({
                title: "上传成功",
                icon: "success",
                duration: 2000,
              });
            }
            this.fileList.push(JSON.parse(res.data).data);
          },
        });
      }
    },
    removeImg(index) {
      this.fileList.splice(index, 1);
    },
    // 处置建议
    getDiseaseDealList() {
      getDiseaseListApi({
        pageNo: 1,
        pageSize: 100,
        dictType: "deal_type",
      }).then((res) => {
        this.dealList = res.data.list.map((item) => {
          return {
            ...item,
            text: item.label,
            value: item.value,
          };
        });
      });
    },
    // 病害等级
    getDiseaseLevelList() {
      getDiseaseListApi({
        pageNo: 1,
        pageSize: 100,
        dictType: "broken_level_type",
      }).then((res) => {
        this.levelList = res.data.list.map((item) => {
          return {
            ...item,
            text: item.label,
            value: item.value,
          };
        });
      });
    },

    async getDataTree1() {
      const res = await getFacilityManagePage({
        pageNo: 1,
        pageSize: 10000,
        longitude: this.longitude,
        latitude: this.latitude,
      });
      this.dataTree1 = res.data.list?.map((item) => ({
        ...item,
        text: item.facilityName,
        value: item.id,
      }));
      let { facilityId } = this.patrolParams;
      let chooseFacility = res.data.list?.find((item) => {
        return +item.id == +facilityId;
      });
      this.chooseFacility = chooseFacility;
      this.patrolParams.facilityName = chooseFacility.id;
      this.getDataTree2(chooseFacility?.facilityType);
      this.getDataXcd(chooseFacility?.id);
    },
    onchange1(e) {
      const current = this.dataTree1.find(
        (item) => item.value === e.detail.value[0]?.value
      );
      this.chooseFacility = current;
      this.patrolParams.facilityId = current?.id;
      this.getDataTree2(current?.facilityType);
      this.getDataXcd(current?.id);
    },
    async getDataTree2(facilityTypeId) {
      const res = await getKgPlaceTypePage({
        pageNo: 1,
        pageSize: 10000,
        facilityTypeId,
      });
      this.dataTree2 = res.data.list?.map((item) => ({
        ...item,
        text: item.placeName,
        value: item.placeTypeId,
      }));
    },
    onchange2(e) {
      const current = this.dataTree2.find(
        (item) => item.value === e.detail.value[0]?.value
      );
      this.getDataTree3(current?.placeName);
    },
    async getDataTree3(partName) {
      const res = await getFacilityComponentPage({
        pageNo: 1,
        pageSize: 10000,
        longitude: this.longitude,
        latitude: this.latitude,
        facilityId: this.patrolParams.facilityId,
        partName,
      });
      this.dataTree3 = res.data.list?.map((item) => ({
        ...item,
        text: item.compName,
        value: item.id,
      }));
    },
    onchange3(e) {
      const current = this.dataTree3.find(
        (item) => item.value === e.detail.value[0]?.value
      );
      this.getDiseaseTypeList(current?.componentType);
    },

    async getDataXcd(facilityId) {
      const res = await patrolPointPage({
        facilityId,
        pageNo: 1,
        pageSize: 10000,
      });
      this.xcdTree1 = res.data.list?.map((item) => ({
        ...item,
        text: item.inspName,
        value: item.id,
      }));
      let { patrolPointId } = this.patrolParams;
      let chooseInspName = res.data.list?.find((item) => {
        return +item.id == +patrolPointId;
      });
      console.log(chooseInspName, "chooseInspName");
      this.patrolParams.inspName = chooseInspName?.id;
    },
    onchangeXcd(e) {},
    // 病害类型
    getDiseaseTypeList(componentTypeId) {
      getDiseaseTypeListApi({
        pageNo: 1,
        pageSize: 10000,
        componentTypeId,
      }).then((res) => {
        this.typeList = res.data.list.map((item) => {
          return {
            ...item,
            text: item.diseaseName,
            value: item.diseaseTypeId,
          };
        });
      });
    },
    submitBtn() {
      if (this.isSubmiting) {
        return;
      }
      let brokenTypeName = ""; // 类型名称
      let facilityName = ""; // 设施名称
      let diseaseLocationName = "";
      let brokenCommpontName = "";
      if (this.brokenType) {
        const result = this.typeList.filter((item) => {
          return item.value == this.brokenType;
        });
        console.log(result);
        brokenTypeName = result[0].text;
      }
      if (this.device) {
        const result = this.dataTree1.filter((item) => {
          return item.value == this.device;
        });
        facilityName = result[0].text;
      }
      if (this.diseaseLocation) {
        const result = this.dataTree2.filter((item) => {
          return item.value == this.diseaseLocation;
        });
        diseaseLocationName = result[0].text;
      }
      if (this.brokenCommpont) {
        const result = this.dataTree3.filter((item) => {
          return item.value == this.brokenCommpont;
        });
        brokenCommpontName = result[0].text;
      }
      let { facilityId, inspName, patrolPointId, taskNum, id, startTaskId } =
        this.patrolParams;
      let params = {};
      if (!this.patrolParams.facilityName) {
        uni.showToast({
          title: "请选择设施名称",
          icon: "error",
          duration: 2000,
        });
        return;
      }
      if (!this.patrolParams.inspName) {
        uni.showToast({
          title: "请选择巡查点名",
          icon: "error",
          duration: 2000,
        });
        return;
      }
      if (Number(this.formData.state) === 1) {
        if (!diseaseLocationName) {
          uni.showToast({
            title: "请选部位",
            icon: "error",
            duration: 2000,
          });
          return;
        }
        if (!brokenCommpontName) {
          uni.showToast({
            title: "请选构件",
            icon: "error",
            duration: 2000,
          });
          return;
        }
        if (!brokenTypeName) {
          uni.showToast({
            title: "请选病害",
            icon: "error",
            duration: 2000,
          });
          return;
        }
        if (!this.brokenLevel) {
          uni.showToast({
            title: "请选病害等级",
            icon: "error",
            duration: 2000,
          });
          return;
        }
        // if (!this.formData.dealRemark) {
        // 	uni.showToast({
        // 		title: '请填病害描述',
        // 		icon: 'error',
        // 		duration: 2000
        // 	});
        // 	return;
        // }
        if (this.formData.area) {
          if (isNaN(this.formData.area)) {
            uni.showToast({
              title: "病害面积必须是数字",
              icon: "none",
              duration: 2000,
            });
            return;
          }
        }

        if (!this.fileList.length) {
          uni.showToast({
            title: "请传图片",
            icon: "error",
            duration: 2000,
          });
          return;
        }
        if (!this.dealMsg) {
          uni.showToast({
            title: "请选建议",
            icon: "error",
            duration: 2000,
          });
          return;
        }
        //1是异常 0 是正常
        params = {
          id: Number(id),
          taskNum,
          patrolPointId,
          taskType: 1,
          reportState: this.formData.state,
          caseManage: {
            caseSource: "0",
            belongTo: String(this.chooseFacility.id),
            facilityName: String(this.chooseFacility.facilityName),
            diseaseLocation: String(this.diseaseLocation),
            diseaseLocationName: String(diseaseLocationName),
            brokenCommpont: String(this.brokenCommpont),
            brokenCommpontName: String(brokenCommpontName),
            location: String(this.location),
            lng: String(this.longitude),
            lat: String(this.latitude),
            brokenType: this.brokenType,
            brokenTypeName: String(brokenTypeName),
            brokenLevel: String(this.brokenLevel),
            brokenDesc: String(this.formData.dealRemark),
            dealRemark: String(this.formData.checkMark),
            area: this.formData.area,
            dealMsg: String(this.dealMsg),
            lnglat: `${this.longitude},${this.latitude}`,
            brokenImg: this.fileList.toString(),
            reportName: String(this.userObj.username),
            city: this.city,
            zone: this.zone,
            province: this.province,
            isAdminAuth: this.formData.isAdminAuth,
          },
        };
      } else {
        // if (!this.fileList.length) {
        //   uni.showToast({
        //     title: '请上传图片',
        //     icon: 'error',
        //     duration: 2000
        //   });
        //   return;
        // }
        if (!this.formData.reportContent) {
          this.formData.reportContent = "暂无内容";
          // uni.showToast({
          // 	title: '请填写内容',
          // 	icon: 'error',
          // 	duration: 2000
          // });
          // return;
        }
        params = {
          id: Number(id),
          taskNum,
          taskType: 1,
          reportState: this.formData.state,
          facilityName: String(this.chooseFacility.facilityName),
          patrolPointId,
          reportImgUrl: this.fileList.toString(),
          reportContent: this.formData.reportContent,
          lng: String(this.longitude),
          lat: String(this.latitude),
        };
      }
      this.isSubmiting = true;
      patrolTaskMobileReportPointApi({ ...params })
        .then((res) => {
          uni.showToast({
            title: "操作成功",
            icon: "success",
            duration: 2000,
          });
          this.batchCreate();
          endPatrolApi({ taskNum, id: startTaskId }).then((res) => {});
          setTimeout(() => {
            uni.navigateBack();
          }, 1000);
        })
        .finally(() => {
          this.isSubmiting = false;
        });
    },
    // 计算距离
    distanceCalculation(log, lat) {
      // console.log(log)
      // console.log(lat)
      let patrolList = this.patrolList;
      if (patrolList.length > 0) {
        patrolList.map((item, index) => {
          item.distance = util.getDistance(
            log,
            lat,
            item.longitude,
            item.latitude
          );
          if (this.distance >= item.distance) {
            //  isDone==0 打点
            if (!item.isDone) {
              this.getDot(item, index);
            }
          }
        });
      }
    },
    // 地址解析
    getAddress(log, lat) {
      let qqmapsdk = new QQMapWX({
        key: "EWNBZ-4PZWG-XUJQK-QQM5S-V74B2-QQBA5",
      });
      qqmapsdk.reverseGeocoder({
        location: {
          latitude: lat,
          longitude: log,
        },
        success: (res) => {
          console.log(res);
          if (res.status == 0) {
            console.log(
              "%c [ res ]-319",
              "font-size:13px; background:pink; color:#bf2c9f;",
              res
            );
            this.location = `${res.result.address}-${res.result.formatted_addresses.recommend}`;
            let {
              province,
              city,
              district: zone,
            } = res.result.address_component;
            this.city = city;
            this.province = province;
            this.zone = zone;
            // this.setData({
            //   'form.locationdDescribe': `${res.result.address}-${res.result.formatted_addresses.recommend}`
            // });
          }
        },
        fail: (err) => {
          console.log(err);
        },
      });
    },
    startLocationUpdate() {
      uni.startLocationUpdate({
        success: (res) => {
          //成功的逻辑
          uni.onLocationChange((data) => {
            console.log(
              "%c [ data ]-243",
              "font-size:13px; background:pink; color:#bf2c9f;",
              data
            );
            // this.city = data.city || ''
            // this.province = data.province || ''
            // this.zone = data.district || ''
            let latitude = data.latitude.toFixed(6) || "";
            let longitude = data.longitude.toFixed(6) || "";
            this.latitude = latitude || "";
            this.longitude = longitude || "";
            let locationArr = uni.getStorageSync("locationArr");
            locationArr.push({
              latitude,
              longitude,
            });
            uni.setStorageSync("locationArr", locationArr);
            this.circles[0].longitude = longitude;
            this.circles[0].latitude = latitude;
            this.distanceCalculation(longitude, latitude);
            if (!this.isChange) {
              this.isChange = true;
              this.getAddress(longitude, latitude);
            }
            //获取当前时间
            var currentTime = new Date().getTime();
            //获取上次保存的位置信息
            var oldLocation = wx.getStorageSync("oldLocation");
            //将经纬度拼接
            var newLocation = latitude + "" + longitude;
            //获取上次执行的时间
            var oldTime = wx.getStorageSync("oldTime");
            if (oldLocation != newLocation && currentTime - oldTime > 20000) {
              //缓存当前最新位置
              wx.setStorageSync("oldLocation", newLocation);
              //缓存当前执行的时间
              wx.setStorageSync("oldTime", currentTime);
              this.getAddress(longitude, latitude);
            }
          });
        },
        fail: (err) => {
          console.log(err);
          //失败的逻辑
          //1.wx.showModal引导用户授权
          //2.通过wx.openSetting让用户开启权限
          uni.showModal({
            //引导用户授权
            title: "提示",
            content: "请打开定位权限",
            confirmText: "设置",
            cancelText: "取消",
            showCancel: false,
            success: (res) => {
              //点击“确认”时打开设置页面
              if (res.confirm) {
                uni.openSetting({
                  //打开设置页面让用户选择权限
                  success: (res) => {
                    console.log(res);
                    if (res.authSetting["scope.userLocation"] == true) {
                      uni.onLocationChange((data) => {
                        //实时获取用户最新的经纬度信息
                        console.log(data);
                      });
                    }
                  },
                });
              } else {
                //取消打开设置授权页面
                uni.showToast({
                  title: "取消授权",
                  icon: "none",
                });
              }
            },
          });
        },
      });
    },
    /**
     * 生命周期函数--监听页面显示
     */
    rad(d) {
      return (d * Math.PI) / 180;
    },

    getDistance(lng1, lat1, lng2, lat2) {
      var radLat1 = this.rad(lat1);
      var radLat2 = this.rad(lat2);
      var a = radLat1 - radLat2;
      var b = this.rad(lng1) - this.rad(lng2);
      var s =
        2 *
        Math.asin(
          Math.sqrt(
            Math.pow(Math.sin(a / 2), 2) +
              Math.cos(radLat1) *
                Math.cos(radLat2) *
                Math.pow(Math.sin(b / 2), 2)
          )
        );
      s = s * 6378.137; //地球半径
      s = Math.round(s * 10000) / 10000;
      return s; //返回数值单位：公里
    },

    // 打点
    getDot(item, index) {
      let data = {
        id: item.id,
        userName: uni.getStorageSync("userInfo").accountName,
        userUuid: uni.getStorageSync("userInfo").accountUuid,
        isDone: 1,
      };
      http.wxRequest(
        "POST",
        "/temporary/doPatrol",
        data,
        (res) => {
          if (res.errcode == 0) {
            Toast({
              type: "text",
              message: "打点成功",
              duration: 1500,
              forbidClick: true,
              onClose: () => {
                // this.getTemporaryByCuringUtil()
              },
            });
          } else {
            Toast({
              type: "text",
              message: res.errmsg,
              duration: 1500,
              forbidClick: true,
            });
          }
        },
        (err) => {
          console.log(err);
        }
      );
    },
    changeState(e) {
      console.log("e:", e);
    },
    //上传变化后巡查点
    batchCreate() {
      let list = uni.getStorageSync("locationArr");
      if (list.length > 0) {
        list = list.map((item) => {
          return {
            creator: this.userObj.username,
            updater: this.userObj.username,
            patrolRecordId: this.patrolParams.patrolPointId,
            longitude: item.longitude,
            latitude: item.latitude,
          };
        });
      }
      batchCreate(list);
    },
  },
};
</script>
<style lang="scss">
page {
  height: 100%;
}
</style>
<style lang="scss" scoped>
@import "@/static/scss/form.scss";
.preview-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;

  .upload-btn-area {
    width: 120upx;
    height: 120upx;
    margin-right: 10px;
    margin-bottom: 10px;
    border: 1upx dashed #f2f2f2;
    border-radius: 12upx;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;

    :deep(.uni-icons) {
      font-size: 80upx !important;
    }
  }
}
.preview-item {
  box-sizing: border-box;
  width: 120upx;
  height: 120upx;
  margin-right: 10px;
  margin-bottom: 10px;
  position: relative;

  .delete-icon {
    position: absolute;
    right: -8upx;
    top: -8upx;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 50%;
    padding: 8upx;

    .uni-icons {
      font-size: 30upx !important;
    }
  }
}
.item-text-overflow {
  padding-left: 5upx !important;
}
.facility-name {
  padding-left: 10upx;
  padding-top: 5upx;
}
/deep/ .tab-c {
  padding-bottom: calc(env(safe-area-inset-bottom) / 2 + 50rpx);
}
</style>
